<template>
  <div>
    <div class="title">
      <div class="title-left">
        <span>所属项目：</span>
        <el-select  v-model="form.projectId" placeholder="请选择" >
          <el-option label="全部" value="0">全部</el-option>
          <el-option v-for="(item,index) in bugProject" :key="index" :label="item.name" :value="item.id">{{item.name}}</el-option>
        </el-select>
        <el-button type="primary" plain @click="selectBug()">查询</el-button>
      </div>
      <div class="title-right">
        <el-button type="success" plain @click="toAdd">添加BUG</el-button>
      </div>
    </div>
    <div class="table">
      <el-table :data="tableData" stripe style="width: 100%">
        <el-table-column prop="id" label="BUG编号" width="180"> </el-table-column>
        <el-table-column prop="severity" label="严重性" width="180"> </el-table-column>
        <el-table-column prop="title" label="标题" width="180"> </el-table-column>
        <el-table-column prop="reportuser" label="报告人" width="180"> </el-table-column>
        <el-table-column prop="createdate" label="报告时间" width="180"> </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  name: "Bug",
  data(){
    return{
      tableData: [],
      bugProject:[],
      form:{}
    }
  },
  methods:{
    init(projectId){
      this.$http.get("/api/api/getAllBugDetailById",{params:{projectId:projectId}}).then(res=>{
        res.data.forEach(a=>{
          if (a.severity==10){
            a.severity="文字错误"
          }else if(a.severity==20){
            a.severity="次要错误";
          }else if(a.severity==30){
            a.severity="严重错误";
          }
        });
        this.tableData=res.data;
      })

    },
    getAllBugProject(){
      this.$http.post("/api/api/getAllBugProject").then(res=>{
        this.bugProject=res.data;
      })
    },
    selectBug(){
      if (this.form.projectId==null){
        this.form.projectId=0;
      }
      this.init(this.form.projectId);
    },
    toAdd(){
      this.$router.replace("/addBug");
    }
  },
  created() {
    this.getAllBugProject();
    this.init(0);
  }
}
</script>

<style scoped>
.title{
  margin: 0 auto;
  width: 750px;
  height: 50px;
  padding: 0;
}
.title-left{
  margin: 0;
  padding: 0;
  height: 100%;
  width: 420px;
  display: inline-block;
  float: left;
}
.title-right{
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100px;
  float: right;
}

.table{
  margin: 0 auto;
  width: 900px;
}
</style>